<script lang="ts">
import { defineComponent } from 'vue'

export default defineComponent({
  name: 'index',
})
</script>

<template>
  <div class="home_box">
<!--    <template >-->
      <div class="home_top">
        <img class="home_top_left" src="@/assets/images/home_top_a.png" alt="" />
        <div class="home_top_content">
          <div class="home_nav_t">
            <img
                class="home_nav_btn"
                src="@/assets/images/home_top_b.png"
                alt=""
            />
          </div>
          <div class="ledge_technology">
            <span>Ledge</span>
            <span>Technology</span>
            <p>Intelligent & Agile</p>
          </div>
<!--          <div class="david">David Yip</div>-->
        </div>
      </div>
      <div class="home_figures">
        <div class="home_figures_content">
          <h3 class="figures_content_title">
            Some Figures to Know About Ledge Technology
          </h3>
          <div class="figures_content">
            <div class="figures_content_info">
              <div class="figures_content_p">
                <h4>1. 3 locations</h4>
                <ul>
                  <li>Shenzhen China</li>
                  <li>Paphos Cyprus</li>
                  <li>Oshawa Canada</li>
                </ul>
              </div>
              <div class="figures_content_p figures_content_b">
                <h4>2. 4000 sqm</h4>
                <ul>
                  <li>factory and office area</li>
                </ul>
              </div>
            </div>
            <div class="figures_content_info">
              <div class="figures_content_p">
                <h4>1. 130 people</h4>
                <ul>
                  <li>10 engineers</li>
                  <li>10 in supply chain</li>
                  <li>10 in project management</li>
                  <li>30 in manufacturing</li>
                  <li>20 in quality control</li>
                  <li>50 factory workers</li>
                </ul>
              </div>
            </div>
            <div class="figures_content_info">
              <div class="figures_content_p">
                <h4>1.11 Production</h4>
                <h4 class="figures_content_h4">Lines</h4>
                <ul>
                  <li>3 SMT production lines</li>
                  <li>2 wave soldering</li>
                  <li>2 robotics soldering</li>
                  <li>2 hand soldering</li>
                  <li>2 assembly & test</li>
                </ul>
              </div>
              <div class="figures_content_p figures_content_b">
                <h4>2.USD5M to</h4>
                <h4 class="figures_content_h4">USD8M</h4>
                <ul>
                  <li>Revenue estimated to</li>
                  <li>increase from USD5M to</li>
                  <li>USD8M from 2022 to</li>
                  <li>2023</li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <img class="figures_a" src="@/assets/images/figures_a.png" alt="" />
      </div>
      <div class="home_design">
        <div class="home_design_left">
          <h3>Why Design with Ledge Technology</h3>
        </div>
        <div class="home_design_right">
          <div class="home_design_content">
            <div class="home_design_content_p">
              <h5>International</h5>
              <div class="home_design_content_line"></div>
              <h6>International team -</h6>
              <h6>no language barriers with</h6>
              <h6>customers</h6>
            </div>
            <div class="home_design_content_p home_design_content_p_two">
              <h5>Professional</h5>
              <div class="home_design_content_line"></div>
              <h6>Wide range of services in</h6>
              <h6>electronics development</h6>
              <ul>
                <li class="home_design_content_li">
                  <div></div>
                  <span>Schematics</span>
                </li>
                <li class="home_design_content_li">
                  <div></div>
                  <span>PCB Layout</span>
                </li>
                <li class="home_design_content_li">
                  <div></div>
                  <span>Functional prototyping</span>
                </li>
                <li class="home_design_content_li">
                  <div></div>
                  <span>Fully functional product</span>
                </li>
              </ul>
            </div>
            <div class="home_design_content_p">
              <h5>Experience</h5>
              <div class="home_design_content_line"></div>
              <h6>Team with experience in</h6>
              <h6>various industries</h6>
              <ul>
                <li class="home_design_content_li">
                  <div></div>
                  <span>Control Equipment</span>
                </li>
                <li class="home_design_content_li">
                  <div></div>
                  <span>Power Measurement Equipment</span>
                </li>
                <li class="home_design_content_li">
                  <div></div>
                  <span>
                  Communication
                  <br />
                  Equipment
                </span>
                </li>
                <li class="home_design_content_li">
                  <div></div>
                  <span>Game and VR Controllers</span>
                </li>
                <li class="home_design_content_li">
                  <div></div>
                  <span>Camera Systems</span>
                </li>
                <li class="home_design_content_li">
                  <div></div>
                  <span>Motion Actuators</span>
                </li>
                <li class="home_design_content_li">
                  <div></div>
                  <span>IoT Devices</span>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
      <div class="home_server">
        <h2>Ledge Design and Full Cycle Services</h2>
        <div class="home_server_content">
          <img src="@/assets/images/home_server_a.png" alt="" />
          <div class="home_server_list">
            <div class="home_server_list_wrap">
              <ul class="home_server_list_ul">
                <li>
                  <div></div>
                  Schematics check
                </li>
                <li>
                  <div></div>
                  PCBA design
                </li>
                <li>
                  <div></div>
                  Mechanics &
                  <br />
                  structure
                </li>
              </ul>
            </div>
            <div class="home_server_list_wrap">
              <ul class="home_server_list_ul">
                <li>
                  <div></div>
                  PCB Prototyping
                </li>
                <li>
                  <div></div>
                  PCBA Prototyping
                </li>
                <li>
                  <div></div>
                  3D Printing & CNC
                </li>
                <li>
                  <div></div>
                  DFM Feedback &
                  <br />
                  Review
                </li>
              </ul>
            </div>
            <div class="home_server_list_wrap">
              <ul class="home_server_list_ul">
                <li>
                  <div></div>
                  Proactive
                  <br />
                  Optimization
                </li>
                <li>
                  <div></div>
                  Comprehensive
                  <br />
                  Planning
                </li>
                <li>
                  <div></div>
                  Global Supply Chain
                </li>
                <li>
                  <div></div>
                  Fast Response
                </li>
              </ul>
            </div>
            <div class="home_server_list_wrap">
              <ul class="home_server_list_ul">
                <li>
                  <div></div>
                  Low to Mid Volume
                </li>
                <li>
                  <div></div>
                  Complete
                  <br />
                  manufacturing
                  <br />
                  processes and
                  <br />
                  facilities
                </li>
                <li>
                  <div></div>
                  Experienced
                  <br />
                  engineering team
                </li>
                <li>
                  <div></div>
                  Fast Response
                </li>
              </ul>
            </div>
            <div class="home_server_list_wrap">
              <ul class="home_server_list_ul">
                <li>
                  <div></div>
                  Overall test
                  <br />
                  engineering abilities
                </li>
                <li>
                  <div></div>
                  Functional test
                </li>
                <li>
                  <div></div>
                  Firmware flashing
                  <br />
                  and programming
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>

      <div class="home_manufacture">
        <div class="home_manufacture_left">
          <h2>Why Manufacture with Ledge Technology</h2>
        </div>
        <div class="home_manufacture_right">
          <div class="home_manufacture_content_box">
            <div class="home_manufacture_content_top">
              <h6>Complete Manufacturing Facilities</h6>
            </div>
            <div
                class="home_manufacture_content_top"
                style="background-color: #2980b9"
            >
              <h6>Experienced Engineering Team</h6>
            </div>
            <div class="home_manufacture_content_top">
              <h6>Agile Supply Chain Management</h6>
            </div>
          </div>
          <img
              class="home_manufacture_content_img"
              src="@/assets/images/home_manufacture_a.png"
              alt=""
          />
        </div>
      </div>
      <div class="home_complete">
        <h2>Complete Manufacturing Facilities</h2>
        <div class="home_complete_content">
          <div class="home_complete_content_info">
            <div class="home_complete_content_heard">
              <h4>International</h4>
            </div>
            <div class="home_complete_content_line"></div>
            <ui class="home_complete_content_ul">
              <li>
                <div></div>
                <span>High Speed SMT lines</span>
              </li>
              <li>
                <div></div>
                <span>
                High Speed Precision Solder
                <br />
                Printing Machines
              </span>
              </li>
              <li>
                <div></div>
                <span>
                10-temperature-zones Reflow
                <br />
                Soldering
              </span>
              </li>
              <li>
                <div></div>
                <span>
                Robotic Soldering & Wave
                <br />
                Soldering
              </span>
              </li>
              <li>
                <div></div>
                <span>Smart BGA Rework</span>
              </li>
              <li>
                <div></div>
                <span>Conformal Coating</span>
              </li>
            </ui>
          </div>
          <div class="home_complete_content_info">
            <div class="home_complete_content_heard">
              <h4>
                Test & Inspection
                <br />
                Equipment
              </h4>
            </div>
            <div class="home_complete_content_line"></div>
            <ui class="home_complete_content_ul">
              <li>
                <div></div>
                <span>X-ray Inspection</span>
              </li>
              <li>
                <div></div>
                <span>3D SPI</span>
              </li>
              <li>
                <div></div>
                <span>In-line AOI</span>
              </li>
              <li>
                <div></div>
                <span>
                Intelligent First Article
                <br />
                Inspection
              </span>
              </li>
              <li>
                <div></div>
                <span>Functional Test</span>
              </li>
              <li>
                <div></div>
                <span>Programming & Firmware Flash</span>
              </li>
            </ui>
          </div>
          <div class="home_complete_content_info">
            <div class="home_complete_content_heard">
              <h4>Manufacturing Expertise</h4>
            </div>
            <div class="home_complete_content_line"></div>
            <ui class="home_complete_content_ul">
              <li>
                <div></div>
                <span>Rapid NPI</span>
              </li>
              <li>
                <div></div>
                <span>Fast PCB/PCBA Prototyping</span>
              </li>
              <li>
                <div></div>
                <span>SMT & THT under IPC Class 3</span>
              </li>
              <li>
                <div></div>
                <span>Test & Assembly</span>
              </li>
              <li>
                <div></div>
                <span>3D Printing & CNC</span>
              </li>
              <li>
                <div></div>
                <span>Mechanics & Molding</span>
              </li>
            </ui>
          </div>
        </div>
      </div>
      <div class="home_experienced">
        <h2>Experienced Engineering Team</h2>
        <div class="home_experienced_content">
          <div class="home_experienced_content_right">
            <img src="@/assets/images/home_experienced_a.png" alt="" />
            <div class="home_experienced_content_one">
              <div class="home_experienced_line"></div>
              <div class="home_experienced_content_p">
                <p>· DFM Feedback &Review</p>
              </div>
              <div class="home_experienced_line_b"></div>
            </div>
            <div class="home_experienced_content_two">
              <div class="home_experienced_content_p">
                <p>
                  · Profound Knowledge on products in different application and
                  industries
                </p>
              </div>
              <div class="home_experienced_line_b"></div>
            </div>
            <div class="home_experienced_content_three">
              <div class="home_experienced_content_p">
                <p>· 4500+ batches of PCBA production per year</p>
              </div>
              <div class="home_experienced_line_b"></div>
            </div>
            <div class="home_experienced_content_four">
              <div class="home_experienced_content_p">
                <p>· Engineering team with 15years+ experiences</p>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="home_agile">
        <h2>Agile Supply Chain Management</h2>
        <div class="home_agile_content">
          <div class="home_agile_content_top">
            <div class="home_agile_content_top_left">
              <p>
                Long-term Cooperation with local brokers with reliable recording
                for component in shortage
              </p>
            </div>
            <div class="home_agile_content_top_right">
              <p>Global Sourcing Team to keep a competitive level on costing</p>
            </div>
          </div>
          <div class="home_agile_content_bottom">
            <div class="home_agile_content_bottom_info">
              <p>BOM Optimization</p>
            </div>
            <div class="home_agile_content_bottom_info">
              <p>Direct Support from Chip Manufacturer</p>
            </div>
            <div class="home_agile_content_bottom_info">
              <p>Comprehensive Planning for Project Cycle</p>
            </div>
          </div>
        </div>
      </div>
      <div class="home_manufacture">
        <div class="home_manufacture_left">
          <h2>Why Manufacture with Ledge Technology</h2>
        </div>
        <div class="home_manufacture_right">
          <div class="home_manufacture_content_box">
            <div class="home_manufacture_content_top">
              <h6>Professional Project Management</h6>
            </div>
            <div
                class="home_manufacture_content_top"
                style="background-color: #2980b9"
            >
              <h6>Professional Project Management</h6>
            </div>
            <div class="home_manufacture_content_top">
              <h6>ISO-certified Management System</h6>
            </div>
          </div>
          <img
              class="home_manufacture_content_img"
              src="@/assets/images/home_manufacture_b.png"
              alt=""
          />
        </div>
      </div>
      <div class="home_professional">
        <h2>Professional Project Management</h2>
        <div class="home_professional_content">
          <div class="home_professional_content_box">
            <p class="home_professional_content_p1">
              Individual Project Product Records
            </p>
          </div>
          <div
              class="home_professional_content_box"
              style="background-color: #00a0b0"
          >
            <p class="home_professional_content_p2">
              Dedicated Team for EQ and Feedback
            </p>
          </div>
          <div class="home_professional_content_box">
            <p class="home_professional_content_p3">
              Individual Project Specialist to Follow up throughout all processes
            </p>
          </div>
        </div>
      </div>
      <div class="home_iso">
        <h2>ISO-Certified Management System</h2>
        <div class="home_iso_img">
          <img src="@/assets/images/home_iso_a.png" alt="" />
          <img class="home_add" src="@/assets/images/home_add.png" alt="">
        </div>
      </div>
      <div class="home_products">
        <h2>Products of Our Customers</h2>
        <div class="home_products_img_list">
          <div class="home_img_top">
            <img
                class="home_img_a"
                src="@/assets/images/home_products_a.png"
                alt=""
            />
            <img
                class="home_img_b"
                src="@/assets/images/home_products_b.png"
                alt=""
            />
            <img
                class="home_img_c"
                src="@/assets/images/home_products_c.png"
                alt=""
            />
          </div>
          <div class="home_img_bottom">
            <img
                class="home_img_d"
                src="@/assets/images/home_products_d.png"
                alt=""
            />
            <img
                class="home_img_e"
                src="@/assets/images/home_products_e.png"
                alt=""
            />
            <img
                class="home_img_g"
                src="@/assets/images/home_products_g.png"
                alt=""
            />
            <img
                class="home_img_h"
                src="@/assets/images/home_products_h.png"
                alt=""
            />
          </div>
        </div>
      </div>
      <div class="home_expertise">
        <img src="@/assets/images/home_expertise_a.png" alt="" />
        <div class="home_expertise_content">
          <div class="home_expertise_content_h">
            <h5>
            <span>
              "Your expertise helps us a lot, wish I could have known you
              earlier"
            </span>
            </h5>
          </div>

          <p class="home_expertise_content_p">
            Enzo says, CEO of Longan Vision Corp., designing AR Headsets for
            firefighters in Canada
          </p>
        </div>
      </div>
      <div class="home_genuinely">
        <div class="home_genuinely_content">
          <h3>
            "I am genuinely delighted with the Ledge's
            <br />
            exceptional design service and production line setup, which made my
            product development and scaling production volume a lot easier."
          </h3>
          <p>
            Michael, CEO from Sistematics Inc., a multi router provider in USA
            says so
          </p>
        </div>
        <img src="@/assets/images/home_genuinely_a.png" alt="" />
      </div>
      <div class="home_thrilled">
        <img src="@/assets/images/home_thrilled_a.png" alt="" />
        <div class="home_thrilled_content">
          <div class="home_thrilled_content_h">
            <h3>
              "Thrilled with Ledge's VR gloves hardware engineering service. Their
              expertise and efficiency outshine US alternatives, saving time and
              money."
            </h3>
          </div>
          <p class="home_thrilled_content_p">
            Alex, CEO from Senso Devices Inc. AR/VR Gloves provider in USA says so
          </p>
        </div>
      </div>
    <div class="home_footer_a">
      <h2>Some of Our End Customers</h2>
      <img src="@/assets/images/home_footer_a.png" alt="" />
    </div>
      <div class="home_us_wrap">
        <div class="home_us_title">
          <div class="home_us_content">Contact us</div>
<!--          <div class="home_us_content_right">-->
<!--            <span class="home_us_content_D">David Yip</span>-->
<!--            <span>/ CEO</span>-->
<!--            <div class="line_blue"></div>-->
<!--          </div>-->

        </div>
        <div class="home_us_info">
          <div class="home_us_info_left">
            <div class="home_us_call">
              <div class="home_us_call_content">
                <img src="@/assets/images/home_us_a.png" alt=""/>
                <div class="home_us_call_t">
                  <h5>TEL：</h5>
                  <p>+86 135 0159 0759</p>
                </div>
              </div>
            </div>
            <div class="home_us_call home_us_call_top">
              <div class="home_us_call_content">
                <img src="@/assets/images/home_us_c.png" alt=""/>
                <div class="home_us_call_t">
                  <h5>E-mail：</h5>
                  <p>DavidYip@intelliagile.com</p>

                </div>
              </div>
            </div>
          </div>
          <div class="home_us_info_right">
            <div class="home_us_call">
              <div class="home_us_call_content">
                <img src="@/assets/images/home_us_b.png" alt=""/>
                <div class="home_us_call_t">
                  <h5>Address：</h5>
                  <p> 3/F,Block 28,Chentian Industrial Area ,</p>
                  <p> Baotian 2nd Road,</p>
                  <p> Xixiang Town,</p>
                  <p> Bao'an District,Shenzhen,</p>
                  <p>  China,518102</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="home_footer">
        <span>Shenzhen Ledge Technology Co.,Ltd.</span>
      </div>
<!--    </template>-->
  </div>
</template>

<style scoped>
@import url('@/assets/font/font.css');
.home_box {
  width: 100%;
  overflow: hidden;
  .home_top {
    width: 100%;
    display: flex;
    .home_top_left {
      width: 600px;
      height: 1080px;
      display: block;
    }
    .home_top_content {
      flex: 1;
      box-sizing: border-box;
      width: 100%;
      padding: 40px 68px 0 58px;
      position: relative;
      .home_nav_t {
        display: flex;
        justify-content: flex-end;
        .home_nav_btn {
          width: 281px;
          height: 115px;
        }
      }
      .ledge_technology {
        width: 100%;
        margin-top: 161px;
        > span {
          display: block;
          font-weight: bold;
          font-size: 126px;
          color: #2980b9;
          font-family: Trocchi-Regular;
        }
        p{
          font-weight: 400;
          font-size: 36px;
          color: #676767;
        }
      }
      .david {
        position: absolute;
        bottom: 40px;
        right: 74px;
        font-weight: 400;
        font-size: 25px;
        color: #5d5d5d;
      }
    }
  }
  .home_figures {
    width: 100%;
    display: flex;
    justify-content: space-between;

    .home_figures_content {
      flex: 1;

      .figures_content_title {
        width: 100%;
        height: 176px;
        background: #2980b9;
        font-weight: 400;
        font-size: 36px;
        color: #ffffff;
        text-align: center;
        line-height: 176px;
        font-family: Trocchi-Regular;
      }
      .figures_content {
        box-sizing: border-box;
        width: 100%;
        padding: 120px 116px 0 144px;
        background-color: #00a0b0;
        height: 904px;

        display: flex;
        .figures_content_p {
          &.figures_content_b {
            margin-top: 37px;
          }
          .figures_content_h4 {
            box-sizing: border-box;
            padding: 0 0 0 40px;
          }
          > h4 {
            font-weight: 400;
            font-size: 36px;
            color: #ffffff;
          }
          > ul li {
            margin-left: 75px;
            width: 317px;
            font-weight: 400;
            font-size: 24px;
            color: #ffffff;
            line-height: 40px;
          }
        }
      }
    }
    .figures_a {
      display: block;
      width: 440px;
      height: 1080px;
    }
  }
  .home_design {
    width: 100%;
    height: 1080px;
    background: #333333;
    display: flex;
    .home_design_left {
      box-sizing: border-box;
      width: 687px;
      height: 100%;
      padding: 0 127px 0 76px;
      font-weight: 400;
      font-size: 72px;
      color: #ffffff;
      display: flex;
      align-items: center;
      justify-content: center;
      h3{
        font-family: Trocchi-Regular
      }
    }
    .home_design_right {
      box-sizing: border-box;
      flex: 1;
      padding-top: 176px;
      .home_design_content {
        display: flex;
        .home_design_content_p {
          width: 341px;
          &.home_design_content_p_two {
            margin: 0 58px;
          }
          .home_design_content_line {
            margin-top: 29px;
            margin-bottom: 53px;
            width: 341px;
            height: 1px;
            background-color: #707070;
          }
          > h5 {
            font-weight: 400;
            font-size: 44px;
            color: #ffffff;
            font-family: Trocchi-Regular


          }
          > h6 {
            font-weight: 400;
            font-size: 24px;
            color: #00a0b0;
          }
          .home_design_content_li {
            display: flex;
            margin-bottom: 28px;
            > div {
              position: relative;
              top: 15px;
              left: 0;
              width: 6px;
              height: 6px;
              background: #ffffff;
              border-radius: 50%;
            }
            > span {
              margin-left: 15px;
              font-weight: 400;
              font-size: 24px;
              color: #ffffff;
            }
          }
        }
      }
    }
  }
  .home_server {
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    padding: 178px 76px 0 76px;
    h2 {
      width: 100%;
      text-align: center;
      font-weight: bold;
      font-size: 72px;
      color: #2980b9;
      font-family: Trocchi-Regular

    }
    .home_server_content {
      width: 100%;
      padding: 0 76px;
      box-sizing: border-box;
      > img {
        margin-top: 139px;
        width: 100%;
        height: 183px;
      }
      .home_server_list {
        margin-top: 24px;
        width: 100%;
        display: flex;
        .home_server_list_wrap {
          width: 375px;
          display: flex;
          justify-content: center;
          .home_server_list_ul {
            > li {
              position: relative;
              width: 100%;
              display: flex;
              margin-bottom: 10px;
              > div {
                position: absolute;
                left: -10px;
                top: 15px;
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background-color: #868686;
              }
              font-weight: 400;
              font-size: 24px;
              color: #868686;
            }
          }
        }
      }
    }
    .triangle {
      width: 0;
      height: 0;
      border-left: 217px solid transparent;
      border-right: 217px solid transparent;
      border-bottom: 235px solid #2980b9;
      font-weight: bold;
      font-size: 66px;
      color: #ffffff;
      text-align: center;
      line-height: 300px;
    }
  }
  .home_manufacture {
    width: 100%;
    height: 1080px;
    background: #333333;
    display: flex;
    .home_manufacture_left {
      box-sizing: border-box;
      width: 614px;
      height: 100%;
      padding: 0 71px 0 67px;
      display: flex;
      align-items: center;
      justify-content: center;
      > h2 {
        font-weight: 400;
        font-size: 72px;
        color: #ffffff;
        font-family: Trocchi-Regular
      }
    }
  }
  .home_manufacture_right {
    box-sizing: border-box;
    width: 100%;
    flex: 1;
    height: 100%;
    padding-top: 12px;
    padding-right: 14px;
    .home_manufacture_content_box {
      display: flex;
      justify-content: space-between;
      .home_manufacture_content_top {
        box-sizing: border-box;
        width: 420px;
        height: 518px;
        background: #00a0b0;
        border-radius: 0px 0px 0px 0px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 69px;
        h6 {
          font-weight: bold;
          font-size: 36px;
          color: #ffffff;
          text-align: center;
          font-family: Trocchi-Regular

        }
      }
    }
    .home_manufacture_content_img {
      margin-top: 16px;
      width: 1306px;
      height: 526px;
    }
  }
  .home_complete {
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    h2 {
      width: 100%;
      padding-top: 40px;
      font-weight: bold;
      font-size: 72px;
      color: #333333;
      text-align: center;
    }
    .home_complete_content {
      box-sizing: border-box;
      width: 100%;
      padding: 98px 85px 0 149px;
      display: flex;
      justify-content: space-between;
      .home_complete_content_info {
        width: 510px;
        .home_complete_content_heard {
          > h4 {
            font-weight: 400;
            font-size: 44px;
            color: #343434;
          }

          height: 116px;
        }
        .home_complete_content_line {
          margin-top: 26px;
          width: 510px;
          height: 1px;
          background-color: #e8e8e8;
          margin-bottom: 65px;
        }
        .home_complete_content_ul {
          > li {
            position: relative;
            margin-bottom: 42px;
            display: flex;
            > div {
              position: relative;
              top: 20px;
              left: 0;
              width: 6px;
              height: 6px;
              background: #343434;
              border-radius: 50%;
            }
            span {
              margin-left: 32px;
              font-weight: 400;
              font-size: 30px;
              color: #343434;
            }
          }
        }
      }
    }
  }
  .home_experienced {
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    > h2 {
      box-sizing: border-box;
      width: 100%;
      padding-top: 40px;
      font-weight: bold;
      font-size: 72px;
      color: #333333;
      text-align: center;
    }
    .home_experienced_content {
      box-sizing: border-box;
      width: 100%;
      padding: 104px 75px 0 83px;
      .home_experienced_content_right {
        position: relative;
        img {
          width: 1048px;
          height: 744px;
        }
        .home_experienced_content_one {
          position: absolute;
          top: 0;
          right: 0;
          width: 1205px;
          .home_experienced_line {
            width: 100%;
            height: 1px;
            background-color: #656565;
          }
          .home_experienced_content_p {
            width: 100%;
            height: 185px;
            > p {
              margin-left: 129px;
              font-weight: 400;
              font-size: 24px;
              color: #7b7b7b;
              line-height: 185px;
            }
          }
          .home_experienced_line_b {
            margin-left: 129px;
            width: 1076px;
            height: 1px;
            background-color: #656565;
          }
        }
        .home_experienced_content_two {
          width: 1070px;
          position: absolute;
          top: 187px;
          right: 0;
          .home_experienced_content_p {
            width: 100%;
            height: 185px;
            > p {
              margin-left: 126px;
              width: 100%;
              font-weight: 400;
              font-size: 24px;
              color: #7b7b7b;
              line-height: 185px;
            }
          }
          .home_experienced_line_b {
            margin-left: 126px;
            width: 944px;
            height: 1px;
            background-color: #656565;
          }
        }
        .home_experienced_content_three {
          width: 994px;
          position: absolute;
          top: 374px;
          right: 0;
          .home_experienced_content_p {
            width: 100%;
            height: 185px;
            > p {
              margin-left: 183px;
              width: 100%;
              font-weight: 400;
              font-size: 24px;
              color: #7b7b7b;
              line-height: 185px;
            }
          }
          .home_experienced_line_b {
            margin-left: 183px;
            width: 811px;
            height: 1px;
            background-color: #656565;
          }
        }
        .home_experienced_content_four {
          width: 811px;
          position: absolute;
          top: 559px;
          right: 0;
          .home_experienced_content_p {
            width: 100%;
            height: 185px;
            > p {
              margin-left: 96px;
              width: 100%;
              font-weight: 400;
              font-size: 24px;
              color: #7b7b7b;
              line-height: 185px;
            }
          }
          .home_experienced_line_b {
            margin-left: 96px;
            width: 811px;
            height: 1px;
            background-color: #656565;
          }
        }
      }
    }
  }
  .home_agile {
    box-sizing: border-box;
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    padding-top: 142px;
    > h2 {
      font-weight: bold;
      font-size: 72px;
      color: #333333;
      text-align: center;
    }
    .home_agile_content {
      box-sizing: border-box;
      width: 100%;
      padding: 106px 77px 0 77px;
      .home_agile_content_top {
        box-sizing: border-box;
        width: 100%;
        padding: 0 103px;
        display: flex;
        justify-content: space-between;
        .home_agile_content_top_left {
          box-sizing: border-box;
          width: 910px;
          height: 306px;
          background: #2980b9;
          border-radius: 0px 0px 0px 0px;
          padding: 77px 34px;
          > p {
            font-weight: 500;
            font-size: 40px;
            color: #ffffff;
            font-family: Trocchi-Regular

          }
        }
        .home_agile_content_top_right {
          box-sizing: border-box;
          width: 580px;
          height: 306px;
          background: #2980b9;
          border-radius: 0px 0px 0px 0px;
          padding: 77px 41px;
          > p {
            font-weight: 500;
            font-size: 40px;
            color: #ffffff;
          }
        }
      }
      .home_agile_content_bottom {
        margin-top: 60px;
        width: 100%;
        display: flex;
        justify-content: space-between;
        .home_agile_content_bottom_info {
          box-sizing: border-box;
          width: 570px;
          height: 220px;
          background: #2980b9;
          border-radius: 0px 0px 0px 0px;
          padding: 0 38px;
          display: flex;
          align-items: center;
          justify-content: center;
          > p {
            font-weight: 500;
            font-size: 40px;
            color: #ffffff;
          }
        }
      }
    }
  }
  .home_professional {
    box-sizing: border-box;
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    padding-top: 267px;
    > h2 {
      width: 100%;
      font-weight: bold;
      font-size: 72px;
      color: #333333;
      text-align: center;
    }
    .home_professional_content {
      box-sizing: border-box;
      width: 100%;
      padding: 155px 40px 0 40px;
      display: flex;
      justify-content: space-between;
      .home_professional_content_box {
        width: 580px;
        height: 288px;
        background: #2980b9;
        border-radius: 16px 16px 16px 16px;

        padding-top: 63px;
        > p {
          font-weight: bold;
          font-size: 38px;
          color: #ffffff;
          font-family: Trocchi-Regular

        }
        .home_professional_content_p1 {
          box-sizing: border-box;
          width: 100%;
          padding: 0 101px;
        }
        .home_professional_content_p2 {
          box-sizing: border-box;
          width: 100%;
          padding: 0 52px;
          font-family: Trocchi-Regular

        }
        .home_professional_content_p3 {
          box-sizing: border-box;
          width: 100%;
          padding: 0 31px;
          font-family: Trocchi-Regular

        }
      }
    }
  }
  .home_iso {
    box-sizing: border-box;
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    padding-top: 40px;
    > h2 {
      font-weight: bold;
      font-size: 72px;
      color: #333333;
      text-align: center;
      font-family: Trocchi-Regular

    }
    .home_iso_img {
      padding-top: 64px;
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      > img {
        width: 1103px;
        height: 778px;
      }
      .home_add{
        width:652px;
        height: 992px;
      }
    }
  }
  .home_products {
    box-sizing: border-box;
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    padding-top: 40px;
    > h2 {
      font-weight: bold;
      font-size: 72px;
      color: #333333;
      text-align: center;
      font-family: Trocchi-Regular

    }
    .home_products_img_list {
      box-sizing: border-box;
      width: 100%;
      padding: 0 74px;
      .home_img_top {
        margin-top: 37px;
        display: flex;
        justify-content: space-between;
        .home_img_a {
          width: 488px;
          height: 418px;
        }
        .home_img_b {
          width: 730px;
          height: 418px;
        }
        .home_img_c {
          width: 485px;
          height: 418px;
        }
      }
      .home_img_bottom {
        margin-top: 34px;
        display: flex;
        justify-content: space-between;
        .home_img_d {
          width: 405px;
          height: 418px;
        }
        .home_img_e {
          width: 365px;
          height: 418px;
        }
        .home_img_g {
          width: 357px;
          height: 418px;
        }
        .home_img_h {
          width: 485px;
          height: 418px;
        }
      }
    }
  }
  .home_expertise {
    box-sizing: border-box;
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    display: flex;
    > img {
      width: 767px;
      height: 1080px;
      display: block;
    }
    .home_expertise_content {
      box-sizing: border-box;
      flex: 1;
      width: 100%;
      padding: 334px 70px 0 70px;
      .home_expertise_content_h {
        width: 100%;
        display: flex;
        justify-content: center;
        > h5 {
          width: 1000px;
          font-weight: bold;
          font-size: 68px;
          color: #333333;
          text-align: center;
          letter-spacing: 5px;
          font-family: Trocchi-Regular

        }
      }
      .home_expertise_content_p {
        margin-top: 24px;
        width: 1000px;
        padding: 0 28px 0 120px;
        font-weight: 400;
        font-size: 28px;
        color: #727272;
        text-align: center;
      }
    }
  }
  .home_genuinely {
    box-sizing: border-box;
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    display: flex;
    .home_genuinely_content {
      box-sizing: border-box;
      flex: 1;
      padding: 113px 74px 0 67px;
      h3 {
        width: 900px;
        font-weight: bold;
        font-size: 68px;
        color: #333333;
        text-align: center;
        font-family: Trocchi-Regular

      }
      > p {
        margin-top: 24px;
        font-weight: 400;
        font-size: 30px;
        color: #727272;
      }
    }
    > img {
      width: 767px;
      height: 1080px;
      display: block;
    }
  }
  .home_thrilled {
    box-sizing: border-box;
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    > img {
      width: 100%;
      height: 448px;
    }
    .home_thrilled_content {
      box-sizing: border-box;
      width: 100%;
      padding: 75px 133px 0 141px;
      .home_thrilled_content_h {
        width: 100%;
        display: flex;
        justify-content: center;
        h3 {
          width: 1400px;
          text-align: center;
          font-weight: bold;
          font-size: 68px;
          color: #333333;
          font-family: Trocchi-Regular

        }
      }
      .home_thrilled_content_p {
        margin-top: 24px;
        width: 100%;
        text-align: center;
        font-weight: 400;
        font-size: 30px;
        color: #727272;
      }
    }
  }
  .home_us {
    box-sizing: border-box;
    width: 100%;
    height: 1080px;
    background: #ffffff;
    border-radius: 0px 0px 0px 0px;
    padding-top: 104px;
    > h4 {
      font-weight: bold;
      font-size: 72px;
      color: #2980b9;
      text-align: center;
    }
    .home_us_man {
      margin-top: 111px;
      .name_s {
        font-weight: bold;
        font-size: 48px;
        color: #343434;
      }
      .home_post {
        font-weight: 400;
        font-size: 43px;
        color: #343434;
      }
      text-align: center;
    }
    .home_us_address {
      width: 100%;
      margin-top: 43px;
      font-weight: 400;
      font-size: 36px;
      color: #343434;
      text-align: center;
    }
    .home_us_line_wrap {
      margin-top: 40px;
      margin-bottom: 70px;
      width: 100%;
      display: flex;
      justify-content: center;
      .us_line {
        width: 1151px;
        height: 1px;
        background-color: #e8e8e8;
      }
    }
    .home_phone_wrap {
      width: 100%;
      display: flex;
      justify-content: center;
      .home_phone {
        display: flex;
        align-items: center;
        .home_round {
          width: 7px;
          height: 7px;
          background: #343434;
          border-radius: 50%;
        }
        .home_phone_info {
          margin-left: 15px;
          font-weight: 400;
          font-size: 36px;
          color: #343434;
        }
      }
      &.home_phone_wrap_two {
        margin-top: 48px;
      }
    }
    .home_us_address_no {
      margin-left: 140px;
      font-weight: 400;
      font-size: 36px;
      color: #343434;
      text-align: center;
    }
  }
  .home_us_wrap{
    width: 100%;
    padding: 100px 200px 185px 200px;
    .home_us_title{
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      .home_us_content{
        font-weight: bold;
        font-size: 80px;
        color: #2980B9;
        font-family: Trocchi-Regular

      }
      .home_us_content_right{
        position: relative;
        .home_us_content_D{
          font-weight: bold;
          font-size: 44px;
          color: #343434;
        }
        span{
          font-weight: 400;
          font-size: 36px;
          color: #343434;
        }
        .line_blue{
          position: absolute;
          left: 0;
          bottom: -20px;
          width: 247px;
          height: 6px;
          background: #2980B9;
        }

      }
    }
    .home_us_info{
      margin-top: 137px;
      display: flex;
      justify-content: space-between;
      .home_us_info_left{
        .home_us_call_top{
          margin-top: 80px;
        }



      }
      .home_us_call{

        .home_us_call_content{
          display: flex;
          >img{
            width: 141px;
            height: 140px;
          }
          .home_us_call_t{
            margin-left: 56px;
            h5{
              margin-top: 23px;
              font-weight: bold;
              font-size: 32px;
              color: #343434;
            }
            p{
              margin-top: 15px;
              font-weight: 400;
              font-size: 30px;
              color: #343434;
            }
          }

        }
      }

    }
  }
  .home_footer{
    width: 100%;
    height: 180px;
    background: #00A0B0;
    font-weight: 400;
    font-size: 36px;
    color: #FFFFFF;text-align: center;
    line-height: 180px;
    font-family: Trocchi-Regular

  }
}
.home_footer_a {
  box-sizing: border-box;
  width: 100%;
  height: 1080px;
  background: #333333;
  border-radius: 0px 0px 0px 0px;
  padding: 0 78px;
  > h2 {
    padding-top: 47px;
    width: 100%;
    font-weight: bold;
    font-size: 72px;
    color: #ffffff;
    text-align: center;
    font-family: Trocchi-Regular
  }
  > img {
    margin-top: 105px;
    width: 100%;
    height: 754px;
  }
}
</style>
